//1. 引入Vue
import Vue from 'vue'

// 2.引入VueRouter
import VueRouter from 'vue-router'

import Login from '../pages/Login'
import Home from '../pages/Home'
import Music from '../pages/Home/Music'
import News from '../pages/Home/News'
import Game from '../pages/Home/Game'
import Subject from '../pages/Home/Subject'

// 3.让Vue使用VueRouter这个插件
Vue.use(VueRouter)

// 4.创建路由对象
export default new VueRouter({
    // 在实例化路由器对象的配置中，书写路由表配置
    routes: [{
            path: '/login',
            component: Login
        },
        {
            path: '/home',
            component: Home,
            children: [{
                    path: 'music/:id/:time?',
                    component: Music,
                    name: 'music',
                    // 在路由配置项中书写props配置项，并且值为true，则代表把当前路由表接收的params动态参数通过props传递给改组件
                    props: true
                },
                {
                    path: 'news',
                    component: News,
                    name: 'news'
                },
                {
                    path: 'subject',
                    component: Subject,
                    name: 'subject',
                    props(route) {
                        return {
                            ...route.query,
                            ...route.params
                        }
                    }
                },
                {
                    path: 'game',
                    component: Game,
                    name: 'game',
                    // // 在路由表中如果props配置是一个对象,则会把对象内的属性一个个通过props传递给当前组件
                    // props:{
                    //     a:1,
                    //     b:2
                    // },
                    // props可以是一个函数,函数的参数是当前路由的$route 路由对象
                    props: (route) => {
                        console.log(route, 'aaa');
                        return {
                            ...route.query,
                            ...route.meta

                        }
                    },
                    meta: {
                        hot: '我永远热爱游戏',
                        isIcon: true
                    }
                },
                // // 1.重定向：默认子路由
                // {
                //     path: '',
                //     component: Music
                // },
                // 2.重定向
                // {
                //     path: '',
                //     redirect: '/home/music'
                // }
            ]
        },
        // redirect 指定一个新的路由地址，设置路由重定向
        {
            path: '/',
            redirect: '/home'
        }
    ]
})